<template>
    <div class="set">
        <p>选购</p>
        <p>{{ text }}</p>
        <p>￥{{ price }} <span>(已省￥100)</span></p>
        <p>选购 ></p>
    </div>
</template>

<script>
export default {
    data() {
        return {
            id: 1,
            num: 1,
            text: '小米11 Ultra,开启影像新时代...',
            price: 1999
        };
    }
};
</script>

<style lang="scss" scoped>
.set {
    margin-left: 50px;
    display: flex;
    height: 50px;
    align-items: center;
    font-size: 20px;
    p {
        margin: 0 15px;
    }
    p:nth-of-type(1) {
        font-weight: bolder;
    }
    p:nth-of-type(3) {
        span {
            color: orange;
        }
    }
    p:nth-of-type(4) {
        margin-left: 230px;
        color: rgb(180, 179, 179);
    }
}
</style>
